setInterval 和setTimeout 清空定时器，返回值,赋值为null的区别

您所在的位置：网站首页 › 清除定时器还有返回值 › setInterval 和setTimeout 清空定时器，返回值,赋值为null的区别

setInterval 和setTimeout 清空定时器，返回值,赋值为null的区别

2023-07-23 17:52| 来源: 网络整理| 查看: 265

1.定时器的返回值

定时器是有返回值得，返回值代表着是第几个定时器，类型是number类型，也可以用来取消定时器，它是定时器的唯一标识符。

var num = 1; function fn() { var timer = setInterval(function () { console.log(num); console.log(timer) }, 1000); }; fn();//1,1

解释：timer的值一定是1，number类型，因为一直是这个定时器在不断的执行所以它的返回值始终是1，返回值的作用就是作为一个引用，指向setInterval，我们也可以用它来清楚定时器 clearInterval(timer)。再看下面代码，内容不变，只加了一个调用。

var num = 1; function fn() { var timer = setInterval(function () { console.log(num); console.log(timer) }, 1000); }; fn();//1,1 fn();//2,2

解释：因为再一次调用了，出现了第2个定时器，所以当第2次调用时，timer的值变成了2，当然清除定时器你也可以直接用clearInterval(2)；现在你知道定时器的返回值是什么了吧？返回值是一个数字,代表当前是第几个定时器而已。

2.定时器赋值为null和清除定时器不是同一个概念

很多人可能会误认为定时器复制为null就等于清楚了定时器，这个是个错误的理解。上面说了 timer只不过是setInterval的一个引用而已，你赋值timer为null,只不过是清除了timer这个变量，清除了timer的内存占用，setInterval还是存在的。看下面的代码

var num = 1; function fn() { var timer = setInterval(function () { console.log(num); timer = null; console.log(timer); }, 1000); }; fn();//1,null 1,null 1,null .....

解释：赋值了timer为null 但是还是一直输出1，就说明定时器更本没有清除。清除定时器只能用clearInterval(timer)。

var num = 1; function fn() { var timer = setInterval(function () { console.log(num); console.log(timer); clearInterval(timer); }, 1000); }; fn();//1,1

解释：这样就只输出一次1,1，因为后面清除了定时器。在页面创建了大量的自定义对象，但是调用后内存无法释放，即使刷新或跳到其它页面，内存仍然没有清空，只有关闭浏览器，内存才释放，长时间使用系统会造成客户端报“虚拟内存不足，所以很多人会清除了定时器再赋值null可以释放内存占用

var num = 1; function fn() { var timer = setInterval(function () { console.log(num); clearInterval(timer); timer =null; }, 1000); }; fn();//1

3. 关于定时器参数问题

相信很多人觉得定时器就2个参数，第一个是个function函数，第二个是个延时时间，这个是我们平时用的最多的。其实并不是这样的，我拿setTimeout为例来说下：

1.第一个参数函数，第二个参数为delay时间

var num = 1; function fn() { var timer = setTimeout(function () { console.log(num); }, 1000); }; fn();//1

解释：因为 num变量在定时器函数中没有，它会向父级寻找所以num =1;其实我们可以传递参数的。

2.第一个参数函数，第二个参数为delay时间，第三个参数为传递的参数

var num = 1; function fn() { var timer = setTimeout(function (num) { console.log(num); }, 1000,'我是传递的参数'); }; fn();//我是传递的参数

解释：因为我往定时器函数中传递了参数，所以打印出来的值是我传递的参数值。其实第一个参数可以不是函数，可以是字符串。

3.第一个参数字符串，第二个参数为delay时间（使用该语法是不推荐的, 原因和使用 eval()一样，有安全风险）

var num = 1; function fn() { var timer = setTimeout('console.log(num)', 1000); }; fn();//1

解释：其实它是能解析字符串，包括字符串函数，这里不能叫函数，只是写法有点区别

var num = 1; var string = 'function (){console.log(num)}'; function fn() { var timer = setInterval('('+string+')'+"();",1000); }; fn();

解释：定时器里面的函数有2种写法，上面string函数（不是字符串）为例子，一种就是setInterval(string,1000);它会自己调用，还有一种就是setInterval(‘string()’,1000)

【本文地址】

setInterval 和setTimeout 清空定时器，返回值,赋值为null的区别

setInterval 和setTimeout 清空定时器，返回值,赋值为null的区别

今日新闻

推荐新闻